"use strict";

$(function () {
    "use strict";
    // 根据购物车是否有商品，渲染页面

    var goods = $.cookie("goods") ? JSON.parse($.cookie("goods")) : [];
    // console.log(goods)
    if (goods.length > 0) {
        // 控制总价函数
        var calTotalPrice = function calTotalPrice() {
            // 总共件数
            var num = 0;
            var len = 0;
            $(".cart-merchant").each(function (ind, val) {
                num += parseInt($(val).find("input").val());
            });
            $.cookie("NUM", num);

            // 选中件数
            $(".cart-merchant .checked").each(function (ind, val) {
                len += parseInt($(val).parent().parent().parent().parent().find("input").val());
            });
            // 计算总价
            var sumPrice = 0;
            $(".cart-merchant .checked").each(function (ind, val) {
                sumPrice += parseInt($(val).parent().parent().parent().find(".total").html().replace('￥', ''));
            });
            $(".footer-left .gray").html(num);
            $(".footer-left .blue").html(len);
            $(".footer-right .totalPrice").html("￥" + sumPrice + ".00");
        };

        // 将选中的商品存入一个新的cookie


        var getConts = function getConts() {
            var goodsConts = [];
            $(".cart-merchant .checkbox[class*= 'checked']").parent().parent().parent().each(function (ind, val) {
                var img = $(val).find("img").attr("src");
                var name = $(val).find(".product-name").html();
                var desc = $(val).find(".product-desc").html();
                var price = $(val).find(".price").html();
                var num = $(val).find("input").val();

                goodsConts.push({
                    img: img,
                    name: name,
                    desc: desc,
                    price: price,
                    num: num
                });
            });

            $.cookie("goodsConts", JSON.stringify(goodsConts));
        };

        // 当没有商品被选中时无法跳转页面
        var NotAllowed = function NotAllowed() {
            if ($(".checkbox").is(".checked")) {
                $(".cart-btn").css("background", "#f66567");
                $(".cart-btn").css("cursor", "pointer");
                $(".cart-btn").on("click", function () {
                    window.location.href = "../order.html";
                });
                getConts();
            } else {
                $(".cart-btn").css("cursor", "not-allowed");
                $(".cart-btn").css("background", "#666");
                $(".cart-btn").off("click");
            }
        };

        var str = "";
        var total = "";
        goods.forEach(function (ind, val) {
            str += "<table class=\"cart-merchant\">\n        <tr>\n            <td class=\"select\">\n                <div class=\"select-all\">\n                    <div class=\"checkbox checked\" flag=\"1\"></div>\n                    <div class=\"product product-link\">\n                        <img src=\"" + goods[val].img + "\" alt=\"\">\n                    </div>\n                    <div class=\"product-info product-link\">\n                        <p class=\"product-name\">" + goods[val].name + "</p>\n                        <p class=\"product-desc\">" + goods[val].desc + "</p>\n                    </div>\n            </div>\n            </td>\n            <td class=\"price\">" + goods[val].price + ".00</td>\n            <td class=\"number\">\n                <div class=\"number-cont\">\n                    <button class=\"num-reduce\">\uFF0D</button>\n                    <div class=\"num\">\n                        <input type=\"text\" value=\"" + goods[val].num + "\">\n                    </div>\n                    <button class=\"num-add\">\uFF0B</button>\n                </div>\n            </td>\n            <td class=\"total\">\uFFE5" + parseInt(goods[val].price.replace('￥', '')) * goods[val].num + ".00</td>\n            <td class=\"ctrl\">\xD7</td>\n        </tr>\n    </table>\n    ";
        });
        total = "<table class=\"cart-header\">\n    <tbody>\n        <tr>\n            <td class=\"select\">\n                <div class=\"select-all\">\n                    <div class=\"checkbox checked\"></div>\n                    <span>\u5168\u9009</span>\n            </div>\n            </td>\n            <td class=\"price\">\u5355\u4EF7(\u5143)</td>\n            <td class=\"number\">\u6570\u91CF</td>\n            <td class=\"total\">\u5C0F\u8BA1(\u5143)</td>\n            <td class=\"ctrl\">\u7F16\u8F91</td>\n        </tr>\n    </tbody>\n    </table>\n        " + str + "\n        <div class=\"cart-footer\">\n    <div class=\"footer-left\">\n        \u5171<span class=\"footer-num gray\"></span>\u4EF6\u5546\u54C1\uFF0C\u5DF2\u9009\u62E9<span class=\"footer-num blue\"></span>\n    </div>\u4EF6\n    <div class=\"footer-right\">\n        <span class=\"footer-num2\">\n            \u5DF2\u4F18\u60E0<span class=\"youhui\">0.00</span>\u5143\uFF0C\u5408\u8BA1(\u4E0D\u542B\u8FD0\u8D39):<span class=\"totalPrice\"></span>\n        </span>\n        <div class=\"cart-btn\">\u53BB\u7ED3\u7B97</div>\n    </div>\n    </div>";
        $(".cart .container").html(total);
        calTotalPrice();
        // 添加事件开始
        // 添加数量事件
        $(".num-add").on("click", function () {
            var num = $(this).parent().find("input").val();
            num = Number(num) + 1;
            // 改变cookie
            var index = $(this).parent().parent().parent().parent().parent().index() - 1;
            goods[index].num = num;
            $.cookie("goods", JSON.stringify(goods));
            // 渲染页面
            $(this).parent().find("input").val(num);
            $(this).parent().parent().parent().find(".total").html(goods[index].price.replace('￥', '') * num + ".00");

            calTotalPrice();
        });
        // 减少数量事件
        $(".num-reduce").on("click", function () {
            var num = $(this).parent().find("input").val();
            num = Number(num) - 1;
            if (num == 0) {
                num = 1;
            }
            // 改变cookie
            var index = $(this).parent().parent().parent().parent().parent().index() - 1;
            goods[index].num = num;
            $.cookie("goods", JSON.stringify(goods));
            // 渲染页面
            $(this).parent().find("input").val(num);
            $(this).parent().parent().parent().find(".total").html(goods[index].price.replace('￥', '') * num + ".00");

            calTotalPrice();
        });
        // 删除商品事件
        $(".cart-merchant .ctrl").on("click", function () {
            var index = $(this).parent().parent().parent().index() - 1;
            goods.splice(index, 1);
            $.cookie("goods", JSON.stringify(goods));
            $(this).parent().parent().parent().remove();

            // 当为被选中的商品被删除后，全选选中
            if ($(".cart-merchant .checkbox[class*='checked']").length == $(".cart-merchant").length) {
                $(".cart-header .checkbox").addClass("checked");
            }
            calTotalPrice();
            NotAllowed();
        });

        // 选中事件
        // flag 表示选中状态
        // var flag = 0;
        $(".cart-merchant .checkbox").click(function () {
            if (Number($(this).attr("flag"))) {
                $(this).removeClass("checked");
                $(this).attr("flag", 0);
                $(".cart-header .checkbox").removeClass("checked");
                // flag = 1;
            } else {
                $(this).addClass("checked");
                $(this).attr("flag", 1);
                if ($(".cart-merchant .checkbox[class*='checked']").length == $(".cart-merchant").length) {
                    $(".cart-header .checkbox").addClass("checked");
                }
                // flag = 0;
            }
            calTotalPrice();
            NotAllowed();
        });
        // 全选中事件
        var flag2 = 0;
        $(".cart-header .checkbox").click(function () {
            if (flag2 == 0) {
                $(this).removeClass("checked");
                $(".cart-merchant").find(".checkbox").removeClass("checked");
                flag2 = 1;
                // flag = 1;
            } else {
                $(this).addClass("checked");
                $(".cart-merchant").find(".checkbox").addClass("checked");
                flag2 = 0;
                // flag = 0;
            }
            calTotalPrice();
            NotAllowed();
        });

        $(".cart-btn").on("click", function () {
            window.location.href = "../order.html";
        });
    }
});